<template>
  <div id="subpage" v-loading="loading">
    <el-col :span="24" class="warp-breadcrum">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>
          <b>首页</b>
        </el-breadcrumb-item>
        <el-breadcrumb-item>微信公众号设置</el-breadcrumb-item>
      </el-breadcrumb>
    </el-col>
    <div class="content">
      <div class="xcx-head">
        <span class="title">微信公众号设置</span>
      </div>
      <div class="xcx-content">
        <el-form
          ref="form_data"
          :model="form_data"
          :rules="rules"
          label-width="160px"
          style="width: 80%"
        >
          <el-form-item
            label="微信APPID："
            prop="WECHAT_OFFICIAL_ACCOUNT_APPID"
          >
            <el-input
              v-model="form_data.WECHAT_OFFICIAL_ACCOUNT_APPID"
              placeholder="请输入微信APPID"
            ></el-input>
          </el-form-item>
          <el-form-item
            label="微信APPSECRET："
            prop="WECHAT_OFFICIAL_ACCOUNT_SECRET"
          >
            <el-input
              v-model="form_data.WECHAT_OFFICIAL_ACCOUNT_SECRET"
              placeholder="请输入微信APPSECRET"
            ></el-input>
          </el-form-item>
          <el-form-item
            label="微信TOKEN："
            prop="WECHAT_OFFICIAL_ACCOUNT_TOKEN"
          >
            <el-input
              v-model="form_data.WECHAT_OFFICIAL_ACCOUNT_TOKEN"
              placeholder="请输入微信TOKEN"
            ></el-input>
          </el-form-item>
          <el-form-item
            label="商户MCHID："
            prop="WECHAT_PAYMENT_MCH_ID"
          >
            <el-input
              v-model="form_data.WECHAT_PAYMENT_MCH_ID"
              placeholder="请输入商户MCHID"
            ></el-input>
          </el-form-item>
          <el-form-item
            label="商户支付key："
            prop="WECHAT_PAYMENT_KEY"
          >
            <el-input
              v-model="form_data.WECHAT_PAYMENT_KEY"
              placeholder="请输入商户支付key"
            ></el-input>
          </el-form-item>
          <el-form-item label="支付回调地址：" prop="WECHAT_PAYMENT_NOTIFY">
            <el-input
              v-model="form_data.WECHAT_PAYMENT_NOTIFY"
              placeholder="请输入微信支付回调地址"
            ></el-input>
          </el-form-item>
          <el-form-item class="mar_T_50">
            <el-button type="primary" @click="save()">保存</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      loading:true,
      form_data: {
        WECHAT_OFFICIAL_ACCOUNT_APPID: "",
        WECHAT_OFFICIAL_ACCOUNT_SECRET: "",
        WECHAT_OFFICIAL_ACCOUNT_TOKEN: "",
        WECHAT_OFFICIAL_ACCOUNT_MCHID: "",
        WECHAT_OFFICIAL_ACCOUNT_AES_KEY: "",
        WECHAT_PAYMENT_NOTIFY: "",
      },
      postData: [],
      id: "",
      rules: {
        WECHAT_OFFICIAL_ACCOUNT_APPID: [
          { required: true, message: "请输入微信APPID", trigger: "blur" },
        ],
        WECHAT_OFFICIAL_ACCOUNT_SECRET: [
          { required: true, message: "请输入微信APPSECRET", trigger: "blur" },
        ],
        WECHAT_OFFICIAL_ACCOUNT_TOKEN: [
          { required: true, message: "请输入微信TOKEN", trigger: "blur" },
        ],
        WECHAT_OFFICIAL_ACCOUNT_MCHID: [
          { required: true, message: "请输入商户MCHID", trigger: "blur" },
        ],
        WECHAT_OFFICIAL_ACCOUNT_AES_KEY: [
          { required: true, message: "请输入商户支付key", trigger: "blur" },
        ],
        WECHAT_PAYMENT_NOTIFY: [
          {
            required: true,
            message: "请输入微信支付回调地址",
            trigger: "blur",
          },
        ],
      },
    };
  },
  mounted() {
    var that = this;
    that.getDetail();
  },
  methods: {
    /**
     * 获取详情
     */
    getDetail() {
      var that = this;
      that.axios.post("/Config/getWechat").then((res) => {
        if (res) {
          that.form_data = res.data;
        }
        that.loading = false;
      });
    },
    save() {
      const that = this;
      that.$refs.form_data.validate((valid) => {
        if (!valid) return that.$message.warning("请完整填写内容!");
        var formData = {};
        formData = that.form_data;
        var url = "/Config/wechat";
        that.axios.post(url, formData).then(() => {
          that.$message.success("保存成功");
          that.$router.push('/Config/wechat');
        });
      });
    },
  },
};
</script>
